<!doctype html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<link rel="stylesheet" href="__MERCHANT_STATIC__/style/css/h-ui/css/H-ui.css">
	<link rel="stylesheet" href="__MERCHANT_STATIC__/style/css/public.css">
	<link rel="stylesheet" href="__MERCHANT_STATIC__/style/css/style.css">
	<style type="text/css">
		#some_file_queue {
			background-color: #ffffff;
		}

		a:hover {
			color: blue;
			cursor: pointer;
		}

		#frm {
			width: 1200px;
			border: none;
			margin: 0 auto;
			padding: 0 100px;
			box-sizing: border-box;
			overflow: hidden;
		}

		#frm .at {
			margin: 50px auto;
			cursor: pointer;
			height: 40px;
			line-height: 40px;
			width: 200px;
			text-align: center;
			border-radius: 3px;
			display: block;
		}

		.create_fileList {}

		.create_fileList .create_fileList_single input,
		select {
			height: 30px;
			margin: 0;
		}

		.create_fileList .create_fileList_single input[type="text"] {
			width: 300px;
		}

		.create_fileList .create_fileList_single input[type="file"] {
			/* position: absolute;
			left: 170px;
			top: 0; */
			display: block;
			margin: 0 !important;
			margin-top: 10px !important;
			height: auto;
		}

		.create_fileList .create_fileList_single input[type="button"] {
			position: absolute;
			left: 190px;
			top: 110px;
		}

		.create_fileList .create_fileList_single select {
			width: 140px;
			margin-right: 15px;
		}

		.create_fileList_single {
			margin-bottom: 30px;
		}

		.create_fileList_single:after {
			content: "";
			display: block;
			clear: both;
		}

		.create_fileList_title {
			width: 160px;
			float: left;
			display: block;
			height: 30px;
			line-height: 30px;
			text-align: left;
			font-size: 16px;
			color: #333;
		}

		.create_fileList_singleContent {
			position: relative;
			float: right;
			width: calc(100% - 160px);
		}

		.create_fileList_singleContent .fanli,
		.fanli2,
		.fanli3,
		.fanli4,
		.fanli1 {
			position: absolute;
			color: #2196f3;
			font-size: 16px;
			top: 0;
			left: 180px;
		}

		.create_fileList_singleContent .radio-box {
			padding-left: 0;
			margin-right: 10px;
		}

		.create_fileList_prompt {
			margin: 0;
			margin-top: 10PX;
			font-size: 14px;
			color: #999999;
		}
		.create_fileList_prompt--red {
			color: red;
			margin: 0;
			margin-top: 10px;
		}
		.button3{
			text-align: center;
			height: 100px;

		}
		.button3 .button1{
			margin: 0 20px;
			height: 40px;
			line-height: 40px;
			width: 200px;
			text-align: center;
			font-size: 18px;
			color: #fff;
			background-color: #0790ef;
			border-radius: 5px;
			float: none;
		}
		
		.button3 .button2{
			margin: 0 20px;
			height: 40px;
			line-height: 40px;
			width: 200px;
			text-align: center;
			font-size: 18px;
			color: #333;
			background-color: #f3f3f3;
			border-radius: 5px;
			float: none;
			display: inline-block
		}
	</style>
</head>

<body>
	{include file="common/business/header"}
	<!-- 入驻流程图 -->
	<ul class="common_stepLine">
		<li class="common_stepLine_single">
			<div class="common_stepLine_title common_stepLine_title--selected">
				<span class="common_stepLine_icon">
						1
				</span> 提交企业资质
			</div>
		</li>
		<li class="common_stepLine_single ">
			<div class="common_stepLine_title common_stepLine_title--selected">
				<span class="common_stepLine_icon">
						2
					</span> 填写店铺信息
			</div>
		</li>
		<li class="common_stepLine_single">
			<div class="common_stepLine_title">
				<span class="common_stepLine_icon">
						3
				</span> 入驻成功
			</div>
		</li>
	</ul>
	<!-- 入驻流程图 -->
	<form id="frm">
		{:token()}
		<ul class="create_fileList">
			<li class="create_fileList_single">
				<span class="create_fileList_title">
					<i class="update_red">*</i>店铺经营类型
				</span>
				<div class="create_fileList_singleContent">
					<input type="text" value="企业店" style="padding-left:20px;width:100px;" disabled>
					<span style="font-size:14px;color:#999999">入驻要求：有限公司资质</span>
				</div>
			</li>
			<li class="create_fileList_single">
				<span class="create_fileList_title">
					<i class="update_red">*</i>店铺主营类目
				</span>
				<div class="create_fileList_singleContent">
					<select class="select"  name="store_category_id">
					{foreach($mainCategory as $k => $v)}
					<option value="{$v['goods_category_id']}">{$v['goods_category_name']}</option>
					{/foreach}
					</select>
					<p onclick="modaldemo()" style="cursor:pointer; color:#2196f3;margin-top:5px;"><span  style="color:#333" >点此查看</span>（店铺主营类目与子营类目关系）</p>
					<div id="modal-demo" class="modal fade" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
						<div class="modal-dialog">
							<div class="modal-content radius" style="width:684px;">
								<div class="modal-header">
									<h3 class="modal-title" style="text-align: center;">查看类目关系</h3>
									<a class="close" data-dismiss="modal" aria-hidden="true" href="javascript:void();">×</a>
								</div>
								<div class="modal-body">
									<img src="__MERCHANT_STATIC__/style/img/typelist.png" style="width:100%" alt="">
								</div>
								<div class="modal-footer">
									<button class="" style="height:40px;width:100px;float:right;color:#fff" data-dismiss="modal" aria-hidden="true">关闭</button>
								</div>
							</div>
						</div>
					</div>
				</div>
			</li>
			<li class="create_fileList_single">
				<span class="create_fileList_title">
					<i class="update_red">*</i>店铺名称
				</span>
				<div class="create_fileList_singleContent">
					<input type="text" name="store_name" placeholder="请输入店铺名称" class="input-text radius size-M">
					<p class="create_fileList_prompt--red">店铺名称确认后就无法修改</p>
					<!-- <span class="ship-name"></span>  -->
				</div>
			</li>
			<li class="create_fileList_single">
				<span class="create_fileList_title">
					<i class="update_red">*</i>店铺头像
				</span>
				<div class="create_fileList_singleContent">
					<div >
						<input type="hidden" value="" id="store-head-img" name="store_face_img">
						<img id="store-head" width="150px" height="150px" src="__MERCHANT_STATIC__/style/img/upload.png" /> 
					</div>
					<p class="create_fileList_prompt">建议尺寸：130X130像素 , 支持png、jpg、gif等基本图片格式，图片小于2M</p>
					<span class="ship-hand"></span>
				</div>
			</li>
			<li class="create_fileList_single">
				<span class="create_fileList_title">
					<i class="update_red">*</i>店铺背景图
				</span>
				<div class="create_fileList_singleContent">
					<div >
						<input type="hidden" value="" id="background-img" name="store_bg_img">
						<img id="background" width="150px" height="150px" src="__MERCHANT_STATIC__/style/img/upload.png" /> 
					</div>
					<p class="create_fileList_prompt">建议尺寸：750X230像素，支持png、jpg、gif等基本图片格式，图片小于2M</p>
					<span class="ship-bg"></span>
				</div>
			</li>
			<li class="create_fileList_single">
				<span class="create_fileList_title">
					<i class="update_red">*</i>店铺介绍
				</span>
				<div class="create_fileList_singleContent">
					<textarea name="store_introduce" cols="100" rows="10" maxlength="200" onKeyDown="textCounter(this.form.store_introduce,this.form.remLen,200);" onKeyUp="textCounter(this.form.store_introduce,this.form.remLen,200);" placeholder="请填相关介绍" style="padding:10px;font-size:16px;"></textarea>
					<span class="ship-intrdict" style="position: absolute;top: 210px;right: 5px;font-size: 14px;">您还可以输入的字:<input name="remLen" type="text" value="200" size="3" readonly="readonly" style="width: 37px;font-size: 20px;"></span>
				</div>
			</li>
		</ul>

		<div class="button3">
			<a href="{:url('enterprise/update', ['enterprise_id' => $enterprise_id])}" class="button2">上一步</a>
			<input type="button" id="submitAction" class="button1" value="提交审核">
		</div>

	</form>
	<!-- 插入底部模块 -->
	{include file="enterprise/footer" /}
</body>

</html>


<script type="text/javascript" src="__MERCHANT_STATIC__/style/js/jquery.min.js"></script>
<script type="text/javascript" src="__WWW_STATIC__/www/index/layer/layer.js"></script>
<script type="text/javascript" src="__MERCHANT_STATIC__/hui/static/h-ui/js/H-ui.js"></script>
<script src="__WWW_STATIC__/lib/plupload/plupload.full.min.js"></script>
<script type="text/javascript">
$(".span:contains('首页')").css("color","#4990E2").siblings().css("display","block")
	$('.checkAlls').on('click', function () {
		if ($('.checkAlls').prop('checked')) {
			$('.inputd').prop('checked', true);
		} else {
			$('.inputd').prop('checked', false);
		}
	});

	function modaldemo() {
		$("#modal-demo").modal("show");
	}

	// 表单提交
	$('#submitAction').click(function () {
		$.ajax({
			type: "POST",
			url: "<?php echo url('store/insert', '', false); ?>",
			dataType: 'json',
			cache: false,
			data: $('#frm').serialize(),
			success: function (data) {
				if (data.status == 1) {
					location.href = "{:url('enterprise/confirm')}";
				} else {
					layer.msg(data.msg);
				}
			},
			error: function (xhr, status, error) {
				
			}
		});
	});

	function lastPage(enterprise_id) {
		$.ajax({
			type: "POST",
			url: "<?php echo url('enterprise/update', '', false); ?>/enterprise_id/" + enterprise_id,
			dataType: 'json',
			cache: false,
			data: $('#frm').serialize(),
			success: function (data) {
				if (data.status == 1) {
					location.href = "{:url('enterprise/confirm')}";
				} else {
					layer.msg(data.msg);
				}
			},
			error: function (xhr, status, error) {
			
			}
		});
	}
	
	//实例化一个plupload上传对象（店铺头像）
	var uploader_idcb = new plupload.Uploader({ 
	browse_button : "store-head",
	url : "{:url('enterprise/uploadImg')}",
	filters : {
		mime_types : [ //只允许上传图片
			{ title : 'Image files', extensions : 'jpg,jpeg,png' }
		],
		max_file_size : '2048kb', //最大只能上传2Mb的文件
		//prevent_duplicates : true //不允许选取重复文件
	},
	multipart_params : {  //附加参数
		type:6,
	},
	multi_selection : false,
	unique_names : true  //上传的文件生成唯一的name值
	});

	//初始化
	uploader_idcb.init(); 

	uploader_idcb.bind('FilesAdded', function(uploader, files){
		uploader.start(); //开始上传
	});

	//绑定单个文件上传完成后事件
	uploader_idcb.bind('FileUploaded', function(uploader, file, res){
		// 获取返回的img src值
		var r = JSON.parse(res.response);
		$('#store-head').attr('src', r.data.imgRoot + r.data.imgName);
		$('#store-head-img').val(r.data.imgName);
	});

	//绑定所有文件上传完成后事件
	uploader_idcb.bind('UploadComplete', function(uploader, files){
		uploader.files.length = 0;  //清空上传队列
	});	
	
	//实例化一个plupload上传对象（店铺背景）
	var uploader_idcb = new plupload.Uploader({ 
	browse_button : "background",
	url : "{:url('enterprise/uploadImg')}",
	filters : {
		mime_types : [ //只允许上传图片
			{ title : 'Image files', extensions : 'jpg,jpeg,png' }
		],
		max_file_size : '2048kb', //最大只能上传2Mb的文件
		//prevent_duplicates : true //不允许选取重复文件
	},
	multipart_params : {  //附加参数
		type:7,
	},
	multi_selection : false,
	unique_names : true  //上传的文件生成唯一的name值
	});

	//初始化
	uploader_idcb.init(); 

	uploader_idcb.bind('FilesAdded', function(uploader, files){
		uploader.start(); //开始上传
	});

	//绑定单个文件上传完成后事件
	uploader_idcb.bind('FileUploaded', function(uploader, file, res){
		// 获取返回的img src值
		var r = JSON.parse(res.response);
		$('#background').attr('src', r.data.imgRoot + r.data.imgName);
		$('#background-img').val(r.data.imgName);
	});

	//绑定所有文件上传完成后事件
	uploader_idcb.bind('UploadComplete', function(uploader, files){
		uploader.files.length = 0;  //清空上传队列
	});

	function textCounter(field, countfield, maxlimit) {
		// 函数，3个参数，表单名字，表单域元素名，限制字符；
		if (field.value.length > maxlimit) {
			//如果元素区字符数大于最大字符数，按照最大字符数截断；
			fieldfield.value = field.value.substring(0, maxlimit);
		} else {
			//在记数区文本框内显示剩余的字符数；
			countfield.value = maxlimit - field.value.length;
		}
	}
</script>